<template>
  <Content>
    <div class="btn" v-if="activeName === 'PolicyManagement'">
      <el-button
        size="small"
        icon="el-icon-upload2"
        type="primary"
        plain
        @click="handleImport"
        >导入运价</el-button
      >
      <el-button
        size="small"
        icon="el-icon-download"
        type="primary"
        @click="handleDownLand"
        plain
        >导入模板下载</el-button
      >
    </div>
    <div class="btn" v-else>
      <el-button
        size="small"
        icon="el-icon-download"
        type="primary"
        plain
        @click="handleDownExcel"
        >导出Excel</el-button
      >
    </div>
    <import-freight v-if="isFlag" @handleClose="handleClose"></import-freight>
    <el-tabs v-model="activeName">
      <el-tab-pane label="政策管理" name="PolicyManagement" lazy>
        <policy-management ref="policyManagementRef" />
      </el-tab-pane>
      <el-tab-pane label="运价管理" name="FreightManagement" lazy>
        <freight-management ref="freightManagementRef" />
      </el-tab-pane>
    </el-tabs>
  </Content>
</template>

<script lang="ts">
import { defineComponent, ref } from 'vue'
import Content from 'components/common/Content.vue'
import PolicyManagement from './components/PolicyManagement.vue'
import FreightManagement from './components/FreightManagement.vue'
import { hyRequest } from '@/service'
import ImportFreight from '@/views/rariffMaintenance/Basics/cpn/ImportFreight.vue'

export default defineComponent({
  name: 'RariffMaintenance',
  components: {
    Content,
    PolicyManagement,
    FreightManagement,
    ImportFreight
  },
  setup() {
    const activeName = ref('PolicyManagement')

    // region 模板下载
    const handleDownLand = () => {
      hyRequest.getDown(
        {
          url: '/asm/rate/basePolicy/downloadBasePrice'
        },
        '国内基础运价导入模板.xlsx'
      )
    }
    // endregion

    // region 导出Excel
    const freightManagementRef = ref<InstanceType<typeof FreightManagement>>()
    const handleDownExcel = () => {
      const ids = freightManagementRef.value?.getSelectList()
      let baseUrl = '?'
      ids?.forEach((item) => (baseUrl = baseUrl + 'ids=' + item + '&'))
      if (baseUrl === '?') {
        baseUrl = ''
      } else {
        baseUrl = baseUrl.slice(0, baseUrl.length - 1)
      }
      hyRequest.getDown(
        {
          url: '/asm/rate/basePrice/exportPriceExcel' + baseUrl,
          headers: {
            'Content-Type': 'application/json; charset=utf-8'
          }
        },
        '基础运价导出.xlsx'
      )
    }
    // endregion

    // region 导入运价
    const isFlag = ref(false)
    const handleImport = () => {
      isFlag.value = true
    }
    const policyManagementRef = ref<InstanceType<typeof PolicyManagement>>()
    const handleClose = (flag: boolean) => {
      isFlag.value = false
      if (flag) {
        policyManagementRef.value?.handleSearch()
      }
    }
    // endregion
    return {
      activeName,
      freightManagementRef,
      isFlag,
      policyManagementRef,
      handleClose,
      handleDownLand,
      handleImport,
      handleDownExcel
    }
  }
})
</script>

<style scoped></style>
